<template>
    <div >
        <Userlist></Userlist>

        <hr>
        <h1>登录</h1>
        <form @submit.prevent="handleLogin">
            <div>
                 <label for="username">用户名：</label>
                 <input type="text" v-model="username" required>
            </div>
            <div>
                <label for="password">密码：</label>
                <input type="password" v-model="password" required>
            </div>
            <button type="submit">登录</button>
        </form>
        <p v-if="message">{{ message }}</p>
    </div>
</template>



<script setup>
import axios from 'axios';
import Userlist from './components/Userlist.vue';
import { ref } from 'vue';
import { loginUser } from './api/index.js';

const username=ref('')
const password=ref('')
const message=ref('')

const handleLogin=async ()=>{
    try {
        const responce=await loginUser({
            username:username.value,
            password:password.value
        })
        if(responce.data.code===200){
            message.value='登录成功'
        }else{
            message.value=responce.data.message
        }

    } catch (error) {
        
    }
}

</script>



<style scoped></style>